<template>
  <el-dialog title="排序" id="article_comment_sort"  :close-on-click-modal="false" :visible.sync="show" class="dialog_index dialog_banner"
   :before-close="cancle">
    <el-form ref="addForm" v-loading="loading" class="article_manage_tag_form" :rules="rules" :model="form">
      <el-form-item label="评论排序：" prop="comment_sort">
        <el-select   placeholder="评论排序（必填项）" v-model="form.comment_sort"  >
          <el-option v-for="product in sortList" :key="product.value" :value="product.value" :label="product.label"></el-option>
        </el-select>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button type="search" @click="submitForm">保存</el-button>
      <el-button @click="cancle">取消</el-button>
    </span>
  </el-dialog>
  
</template>

<script>
import { set_sort } from '@/api/article/article_comment.js'

export default {
  data () {
    return  {
      loading: false,
      form: {
        comment_sort: '',
      },
      sortList: [
        {value: '1', label: 'S'},
        {value: '2', label: 'A'},
        {value: '3', label: 'B'},
        {value: '4', label: 'C'},
        {value: '5', label: 'D'},
      ],
      rules:{
        comment_sort:[
          { required: true, message: '字段评论排序为必填项', trigger: 'blur' },
        ],
      },
    }
  },
  props: {
    show: Boolean,
    closeDialog:Function,
    idList: Array
  },
  methods: {
    submit () {
      let params  ={
        id:JSON.stringify(this.idList),
        comment_sort: this.form.comment_sort
      }
      set_sort(params).then(res=>{
        if(res.state == 1){
          this.$message.success('保存成功')   
          this.cancle()
        }
      })
    },
    submitForm () {
      this.$refs.addForm.validate((valid) => {
        console.log(valid)
        if (valid) {
          this.submit()
        }
      })
    },
    cancle(){
      // this.$refs.addSiteFrom.clearValidate();
      this.$refs.addForm.resetFields(); // 清空原来的数据
      this.$emit('closeDialog')

    },
  }
}
</script>

<style lang="scss">
#article_comment {
  #article_comment_sort{
    .el-form {
      .el-form-item__label{
        width: 78px;
        white-space: nowrap;
      }
      .el-form-item__content {
        display: inline-block;
        width: calc(100% - 78px);
      }
    }
  }
 

}

</style>